<template>
    <div class="example">
      <van-cell title="展示弹出层" is-link @click="showPopup" />
      <van-popup v-model:show="show" position="top" :style="{ height: '30%' }">内容</van-popup>

      <div class="lang-change">
        <VanButton @click="changeLocale('zh')">中文</VanButton>
        <VanButton @click="changeLocale('en')">英文</VanButton>
      </div>

    </div>
  </template>
  <script setup lang="ts">
    import {ref, defineEmits } from 'vue';
    import { showSuccessToast } from 'vant';
    import { i18n, setI18nLanguage } from '@/utils/languages';
    import { useI18n } from 'vue-i18n';
    // import { i18n, useI18n, setI18nLanguage, langToNum } from '@star/languages';
    const { t } = useI18n();

    import usePopup from '@/hooks/usePopup';
    const { 
    showLoadingToast,
    showSuccessToast,
    showFailToast 
    } = usePopup();

    type Props = {};
  
    const props = defineProps<Props>();
    
    const emit = defineEmits(['changeTabType']);
    const show = ref<boolean>(false);
    const showPopup = () => {
        show.value = true;
        showSuccessToast('复制成功');
    }
    // 显示加载提示（自动消失）
    showLoadingToast({
        message: '数据加载中...',
        duration: 2000
    });
    const changeLocale = async (str: string) => {
        // langToNum(str);
        await setI18nLanguage(str);
        console.log(11111, str, t('密码'));
    };
  </script>
  <style>
  @media (min-width: 1024px) {
    .example {
      min-height: 100vh;
      display: flex;
      align-items: center;
    }
  }
  </style>
  